<template>
  <div>
    <div class='recommend-title'>推荐文章</div>
    <ul>
      <routerLink tag="li" 
        class="item"
        v-for="item in RecommendList"
        :key='item.id'
        :to="'/category/'+item.id"
      >
        <!-- <div class="item-img-warpper">
          <img class="item-img" :src="item.url" alt="">
        </div> -->
        <div class="item-info">
          <p class="item-title">{{item.title}}</p>
          <p class="item-desc">{{item.desc}}</p>
          <button class="item-button">查看详情</button>
        </div>
      </routerLink>
    </ul>
  </div>
</template>

<script>
  export default {
    name:'HomeBlog',
    data() {
      return {
        RecommendList:[{
          id:'0001',
          url:'//imgs.qunarzz.com/vs_ceph_vs_tts/38c34dbb-2675-4607-9877-8c76cac009d4.jpg_r_480x320x90_91a86de7.jpg',
          title:'北京-罗马 13天跟团游',
          desc:'德法意瑞12-14天｜含小费｜罗马深度游+罗浮宫+莎士比亚书店｜赠意式特色餐'
        },{
          id:'0002',
          url:'//imgs.qunarzz.com/vs_ceph_vs_tts/38c34dbb-2675-4607-9877-8c76cac009d4.jpg_r_480x320x90_91a86de7.jpg',
          title:'北京-罗马 13天跟团游',
          desc:'德法意瑞12-14天｜含小费｜罗马深度游+罗浮宫+莎士比亚书店｜赠意式特色餐'
        },{
          id:'0003',
          url:'//imgs.qunarzz.com/vs_ceph_vs_tts/38c34dbb-2675-4607-9877-8c76cac009d4.jpg_r_480x320x90_91a86de7.jpg',
          title:'北京-罗马 13天跟团游',
          desc:'德法意瑞12-14天｜含小费｜罗马深度游+罗浮宫+莎士比亚书店｜赠意式特色餐'
        },{
          id:'0004',
          url:'//imgs.qunarzz.com/vs_ceph_vs_tts/38c34dbb-2675-4607-9877-8c76cac009d4.jpg_r_480x320x90_91a86de7.jpg',
          title:'北京-罗马 13天跟团游',
          desc:'德法意瑞12-14天｜含小费｜罗马深度游+罗浮宫+莎士比亚书店｜赠意式特色餐'
        }]
      }
    },
  }
</script>

<style lang="scss" scoped>

</style>